<template>
  <div class="focusBox">
    <van-nav-bar class="head" title="活动分享" left-text="" left-arrow />

    <div class="main">
      <div class="up">
        <h5>面膜比较试验购样(澳门实体店)</h5>
        <van-row gutter="8" style="margin: 20px 0">
          <van-col span="9" style="font-size: 10px">2021-12-10</van-col>
          <van-col span="9" style="font-size: 10px">深圳福田志愿者分队</van-col>
          <van-col span="6" style="font-size: 10px">体察活动</van-col>
        </van-row>
        <van-divider />
      </div>

      <div class="center">
        <p>
          新华社哈尔滨12月6日电（记者杨思琪、徐凯鑫）微电影、图片展、视频分享、线上互动……面对“00后”学生，一些高校思政课不断深挖内涵、创新形式，增加互动式、体验式教学，推进党的十九届六中全会精神入脑入心。Lorem
          ipsum dolor sit amet consectetur adipisicing elit. Omnis quas,
          consequuntur veniam aut pariatur voluptate incidunt. Voluptates illo
          nam velit, obcaecati sint id amet exercitationem eos voluptatibus
          deserunt praesentium delectus?
        </p>
        <van-image
          width="352px"
          height="204px"
          src="https://img01.yzcdn.cn/vant/cat.jpeg"
        />
      </div>
    </div>

    <div class="">
      <!-- 弹出层 -->
      <van-cell is-link @click="showPopup">关注</van-cell>
      <van-popup v-model="show">
        <span style="display:inline-block;width:6.25em;height: 1.5em;">
          <van-icon name="success" color="rgba(67, 207, 124, 1)" />
          关注成功
        </span>
      </van-popup>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      show: false,
    };
  },

  methods: {
    showPopup() {
      this.show = true;
    },
  },
};
</script>

<style lang="less" scoped>
* {
  margin: 0;
  padding: 0;
  p {
    line-height: 30px;
    font-size: 14px;
    text-align: left;
  }
  .van-divider {
    margin: 0;
    background-color: #999;
  }
}

.focusBox {
    .head {
    width: 100%;
    height: 51px;
    color: rgba(80, 80, 80, 1);
    background-color: rgba(239, 239, 239, 1);
    position: fixed;
    top: 0;
  }
  /deep/.van-nav-bar .van-icon {
    color: rgba(153, 153, 153, 1);
  }
  /deep/.van-nav-bar__title {
    color: rgba(42, 131, 78, 1);
    font-size: 18px;
  }
  .main {
    padding-top: 66px;
    .up {
      text-align: center;
    
    }
      .van-button {
        width: 553.125px;
        height: 62.5px;
        margin: 12.5px 0;
      }
    }
  
}
</style>